/*
 * @Author: thl t15945324431@163.com
 * @Date: 2023-12-12 14:00:27
 * @LastEditors: thl t15945324431@163.com
 * @LastEditTime: 2023-12-12 16:00:04
 * @FilePath: \cw_web\gl\src\views\privacySetting\aboutUs\component\editor.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React, { Component } from 'react';
import { Button, Form, Input, Space, Radio } from "antd";
import TheQuill from "../../../../components/TheQuill";
import TheUpload from '../../../../components/TheUpload';

class Editor extends Component {
    constructor(props) {
        super(props)
        this.state = {
            fileList: null,
        }
    }
    componentDidMount() {
        if (this.props.data) {
            this.formRef.setFieldsValue({ ...this.props.data })
            this.setNewsContent(this.props.data.aboutUsDetails)
            const fileList = [
                {
                    uid: '-1',
                    name: 'image.png',
                    status: 'done',
                    url: this.props.data.aboutUsDetailsImage,
                },
            ]
            this.setState({
                fileList
            })
        }
        console.log(this.state.fileList)
    }

    /**
     * @desc 设置新闻内容表单默认值
     * */
    setNewsContent = (data) => {
        this.formRef.setFieldsValue({ aboutUsDetails: data })
    }

    //图片上传回调
    getDetailsFileResult = value => {
        console.log(value)
        if (value.length && value[0] && value[0].response) {
            this.formRef.setFieldsValue({
                aboutUsDetailsImage: value[0].response.data
            })
        } else {
            this.formRef.setFieldsValue({
                aboutUsDetailsImage: ''
            })
        }
    }
    render() {
        const { btnLoading, dialogCancel, onFinish, data, } = this.props
        const { fileList } = this.state
        let show = !!this.props.data.length
        return <Form
            ref={ref => {
                this.formRef = ref
            }}
            onFinish={onFinish}
        >
            <Form.Item name={'aboutUsTitle'} rules={[{ required: true, message: '请输入标题' }]} label={'标题'}>
                {show && <Input maxLength={20} />}
                {!show && <span>{'隐私政策'}</span>}
            </Form.Item>
            <Form.Item label={'文本'} name={'aboutUsDetailsScript'} >
                <Input />
            </Form.Item>
            <Form.Item label="日期" name="receiveTime"
                rules={[{ required: true, message: '请选择日期' }]}
                getValueProps={v => ({ value: v ? moment(v) : null, v })}
                getValueFromEvent={e => e ? moment(e).format('YYYY-MM-DD') : e}
            >
                <DatePicker
                    showTime={{
                        format: 'YYYY-MM-DD',
                    }}
                    format="YYYY-MM-DD"
                    style={{ width: 200 }}
                />
            </Form.Item>
            <Form.Item label={'图片'} name={'aboutUsDetailsImage'} >
                {this.props.data.aboutUsDetailsImage && fileList && fileList.length &&
                    <TheUpload fileList={fileList} maxSize={10} len={1}
                        getFileResult={this.getDetailsFileResult} />}
                {
                    !this.props.data.aboutUsDetailsImage && <TheUpload len={1} maxSize={10}
                        getFileResult={this.getDetailsFileResult} />
                }
            </Form.Item>
            <Form.Item name={'aboutUsDetails'}
                label={'详情'}>
                <TheQuill defaultValue={data.aboutUsDetails} setNewsContent={this.setNewsContent} />
            </Form.Item>
            <div className="p-text-align">
                <Space size="large">
                    <Button key="back" onClick={dialogCancel}>
                        取 消
                    </Button>
                    <Button type="primary" loading={btnLoading} htmlType="primary">
                        确 定
                    </Button>
                </Space>
            </div>
        </Form>
    }
}

export default Editor;